import React, { Component } from 'react'
import { View, Text, RadioGroup, Radio, Input, Icon, Button } from '@tarojs/components'
import './publish.scss'
import Taro from '@tarojs/taro'
import { post } from '../../utils/http'
import Feedback from '../../components/feedback'


export default class publish extends Component {


  state = {
    latitude: '',
    longitude: '',
    address: '点击选择',
    type: 'buy',
    message: '',
    contact: '',
    issubmit: false,
    isresult: false,
    issuccess: false
  }



  chooseLocation() {
    Taro.chooseLocation({
      complete: (res) => {
        console.log(res)
        this.setState({
          address: res.address,
          longitude: res.longitude,
          latitude: res.latitude
        })
      }
    })
  }

  radioChange(e) {
    console.log(e);
    this.setState({
      type: e.detail.value
    })
  }

  inpuntMessage(e) {
    this.setState({
      message: e.target.value
    })
  }

  inputContact(e) {
    this.setState({
      contact: e.target.value
    })
  }

  async handleSubmit() {

    var options = {
      icon: 'none',
      duration: 2000
    }

    if (this.state.address === '点击选择') {
      Taro.showToast({
        title: '请选择地址信息',
        ...options
      })
      return;
    }


    if (!this.state.message) {
      Taro.showToast({
        title: '请填写您的具体需求',
        ...options
      })
      return;
    }

    if (!this.state.contact) {
      Taro.showToast({
        title: '请填写您的联系方式',
        ...options
      })
      return;
    }

    this.setState({
      issubmit: true
    })
    Taro.showLoading({
      title: 'loading...',
    })

    let rs = await post('/index.php/trade/add_item', {
      address: this.state.address,
      latitude: this.state.latitude,
      longitude: this.state.longitude,
      message: this.state.message,
      contact: this.state.contact,
      type: this.state.type
    })
    console.log(rs)

    Taro.hideLoading({
      success: (res) => { }
    })

    this.setState({
      isresult: true,
      issuccess: rs.ret
    })

  }

  // goHome() {
  //   wx.navigateTo({
  //     url: '/pages/index/index',
  //   })
  // },
  republish() {
    this.setData({
      issubmit: false,
      issuccess: false,
      isresult: false
    })
  }


  render() {

    let context = (
      <View>
      <View class="item">
        <Text>我的地址</Text>
        <View placeholder="" value="" onClick={() => this.chooseLocation()}>
          {this.state.address}
        </View>
      </View>

      <View class="item">
        <Text>类型</Text>
        <RadioGroup bindchange="radioChange">
          <Radio value="buy" checked="true" />求购
        <Radio value="sell" /> 转让
      </RadioGroup>
      </View>

      <View class="item">
        <Text>说明</Text>
        <Input placeholder="填写您的具体需求"
          onInput={(e) => this.inpuntMessage(e)}
        ></Input>
      </View>

      <View class="item">
        <Text>联系方式</Text>
        <Input placeholder="填写您的联系方式" type="number" onInput={(e) => this.inputContact(e)}></Input>
      </View>

      <View class="btn" onClick={() => this.handleSubmit()}>
        发布信息
    </View>

    </View>
    )

    return (
      <>
        {
          !this.state.issubmit? context :''
        }
        {
          this.state.isresult ? 
          <Feedback issuccess={this.state.issuccess} 
          republishEvent={()=>this.republish()} ></Feedback> : ''
        }

      </>
    )
  }
}
